<template>
  <div id="app">
    <router-view />
  </div>
</template>

<script setup>
// 根组件
</script>

<style>
#app {
  font-family: 'Helvetica Neue', Helvetica, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', '微软雅黑', Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  height: 100%;
  overflow: hidden;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  background-color: #fff;
}
html, body {
  height: 100%;
  overflow: hidden !important;
}
.main-layout {
  height: 100vh;
  overflow: hidden;
}

/* 黑夜模式 */
html[data-theme='dark'] body,
html[data-theme='dark'] #app {
  background: #181c1f !important;
  color: #e6e6e6 !important;
}
html[data-theme='dark'] .main-layout,
html[data-theme='dark'] .chat-main {
  background: #181c1f !important;
}
html[data-theme='dark'] .sidebar {
  background: #23272a !important;
  border-right: 1px solid #222 !important;
}
html[data-theme='dark'] .logo {
  color: #fff !important;
}
html[data-theme='dark'] .sidebar-section-title {
  color: #b6eac7 !important;
}
html[data-theme='dark'] .chat-item {
  color: #e6e6e6 !important;
}
html[data-theme='dark'] .chat-item.active,
html[data-theme='dark'] .chat-item:hover {
  background: #263c2a !important;
  color: #21ba45 !important;
}
html[data-theme='dark'] .new-chat-btn {
  background: #21ba45 !important;
  color: #fff !important;
}
html[data-theme='dark'] .new-chat-btn:hover,
html[data-theme='dark'] .new-chat-btn:focus {
  background: #179a36 !important;
  color: #fff !important;
}
html[data-theme='dark'] .sidebar-user-bottom,
html[data-theme='dark'] .sidebar-user-bottom-collapsed {
  background: transparent !important;
}
html[data-theme='dark'] .greeting-text,
html[data-theme='dark'] .username {
  color: #fff !important;
}
html[data-theme='dark'] .greeting-sub {
  color: #21ba45 !important;
}
html[data-theme='dark'] .start-quiz-btn {
  background: #21ba45 !important;
  color: #fff !important;
}
html[data-theme='dark'] .start-quiz-btn:hover {
  background: #179a36 !important;
}
html[data-theme='dark'] .chat-input-card,
html[data-theme='dark'] .chat-content-wrapper,
html[data-theme='dark'] .chat-messages-area {
  background: #23272a !important;
  color: #e6e6e6 !important;
}
html[data-theme='dark'] .el-dropdown-menu__item.is-active,
html[data-theme='dark'] .el-dropdown-menu__item:hover {
  color: #21ba45 !important;
  background: #263c2a !important;
}
</style> 